import Vue from "vue";
import VXETable from "vxe-table";
import XEUtils from "xe-utils";

import vDownDialog from "./components/vDownDialog.vue";
import vDownTreesAndListsDialog from "./components/vDownTreesAndListsDialog.vue";

Vue.component(vDownDialog.name, vDownDialog);
Vue.component(vDownTreesAndListsDialog.name, vDownTreesAndListsDialog);

function getModelEvent(renderOpts) {
    return "input";
}

function getChangeEvent(renderOpts) {
    let type = "change";

    switch (renderOpts.name) {
        case "ElAutocomplete":
            type = "select";
            break;

        case "ElInput":
        case "ElInputNumber":
            type = "input";
            break;
    }

    return type;
}

function getNativeOns(renderOpts, params) {
    let nativeEvents = renderOpts.nativeEvents;
    let nativeOns = {};

    XEUtils.objectEach(nativeEvents, function (func, key) {
        nativeOns[key] = function () {
            for (
                let _len = arguments.length, args = new Array(_len), _key = 0;
                _key < _len;
                _key++
            ) {
                args[_key] = arguments[_key];
            }

            func.apply(void 0, [params].concat(args));
        };
    });

    return nativeOns;
}

function getOns(renderOpts, params, inputFunc, changeFunc) {
    let events = renderOpts.events;
    let modelEvent = getModelEvent(renderOpts);
    let changeEvent = getChangeEvent(renderOpts);
    let isSameEvent = changeEvent === modelEvent;
    let ons = {};
    XEUtils.objectEach(events, function (func, key) {
        ons[key] = function () {
            for (
                let _len2 = arguments.length,
                    args = new Array(_len2),
                    _key2 = 0;
                _key2 < _len2;
                _key2++
            ) {
                args[_key2] = arguments[_key2];
            }

            func.apply(void 0, [params].concat(args));
        };
    });
    console.log("events", events, modelEvent, changeEvent, ons);

    if (inputFunc) {
        ons[modelEvent] = function (targetEvnt) {
            inputFunc(targetEvnt);

            if (events && events[modelEvent]) {
                events[modelEvent](params, targetEvnt);
            }

            if (isSameEvent && changeFunc) {
                changeFunc(targetEvnt);
            }
        };
    }

    if (!isSameEvent && changeFunc) {
        ons[changeEvent] = function () {
            for (
                let _len3 = arguments.length,
                    args = new Array(_len3),
                    _key3 = 0;
                _key3 < _len3;
                _key3++
            ) {
                args[_key3] = arguments[_key3];
            }

            changeFunc.apply(void 0, args);

            if (events && events[changeEvent]) {
                events[changeEvent].apply(events, [params].concat(args));
            }
        };
    }

    return ons;
}

function getEditOns(renderOpts, params) {
    let $table = params.$table,
        row = params.row,
        column = params.column;
    return getOns(
        renderOpts,
        params,
        function (value) {
            // 处理 model 值双向绑定
            XEUtils.set(row, column.property, value);
        },
        function () {
            // 处理 change 事件相关逻辑
            $table.updateStatus(params);
        }
    );
}

// 创建一个下拉表格渲染
VXETable.renderer.add("vDownDialog", {
    autofocus: ".vxe-input--inner",
    renderEdit(h, renderOpts, params) {
        // eslint-disable-next-line no-unused-lets
        const {row, column} = params;
        const {attrs, props} = renderOpts;
        let cellValue = XEUtils.get(row, column.property);
        return [
            // <v-down-dialog params={ params } props={props} attrs={attrs}></v-down-dialog>
            h("v-down-dialog", {
                attrs: attrs,
                props: Object.assign(props, {params, value: cellValue}),
                on: getEditOns(renderOpts, params),
                nativeOn: getNativeOns(renderOpts, params)
            })
        ];
    }
});

// 创建一个下拉表格渲染
VXETable.renderer.add("vDownTreesAndListsDialog", {
    autofocus: ".vxe-input--inner",
    renderEdit(h, renderOpts, params) {
        // eslint-disable-next-line no-unused-lets
        const {row, column} = params;
        const {attrs, props} = renderOpts;
        debugger
        let cellValue = XEUtils.get(row, column.property);
        return [
            h("v-down-trees-and-lists-dialog", {
                attrs: attrs,
                props: Object.assign(props, {params, value: cellValue}),
                on: getEditOns(renderOpts, params),
                nativeOn: getNativeOns(renderOpts, params)
            })
        ];
    }
});
VXETable.renderer.add("vSelectBottom", {
    autofocus: "input.el-input__inner",
    renderEdit(h, renderOpts, params) {
        // eslint-disable-next-line no-unused-lets
        const {row, column} = params;
        const {attrs, props} = renderOpts;
        let cellValue = XEUtils.get(row, column.property);
        return [
            // <v-down-dialog params={ params } props={props} attrs={attrs}></v-down-dialog>
            h("vSelectBottom", {
                attrs: attrs,
                props: Object.assign(props, {params, value: cellValue}),
                on: getEditOns(renderOpts, params),
                nativeOn: getNativeOns(renderOpts, params)
            })
        ];
    },
    // 可编辑显示模板
    renderCell(h, renderOpts, params) {
        const {row, column} = params;
        const {options} = renderOpts;
        let cellValue = XEUtils.get(row, column.property);
        let value = cellValue;
        if (options) {
            let filter = options.filter(item => cellValue === item.sid);
            if (XEUtils.isArray(filter) && filter.length) {
                value = filter[0].code;
            }
        }
        return [<span>{value}</span>];
    }
});
